<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" rel="stylesheet" href="static/css/photoview.css" />
<title>Photo's View</title>
</head>

<body>
	<div id="main_wrapper">
		<div id="content">
			<div id="header">This is header</div>
			<div id="container">
				<c:if test="${empty item}">
            	Image Not Found
        	</c:if>
				<c:if test="${not empty item}">
					<div class="images">
						<div class="images_show">
							<center>
								<img src="/social/static/Upload/${item.uuid}.png"
									style="height: 400px; width: 700px;" alt="No image found" />
							</center>
						</div>
						<div class="images_info">
							<div class="images_info_left">
								<p class="images_info_left_view" style="font-style: italic">
									<strong>"${item.view}"</strong> views
								</p>
								<p class="images_info_left_datepost" style="font-style: italic">"${item.date}"</p>
								<p class="images_info_left_postby" style="font-style: italic">
									By<strong>"${item.user.name}"</strong>
								</p>

							</div>
							<div class="images_info_right">
								<p class="images_info_right_title">album :
									"${item.entryGroup.description}"</p>
								<p class="images_info_right_description">"${item.content}"</p>
							</div>
						</div>
					</div>

					<div class="comment">
						<h2>Comment:</h2>

						<c:forEach items="${childs}" var="child">
							<div class="comment_personal">
								<center>
									<img src="/social/static/Upload/${child.user.avatar}.png"
										style="height: 70px; width: 70px; float: left"
										alt="${child.user.name}" />
									<p style="float: left;">
										<a href="">"${child.user.name}"</a>
									</p>
								</center>
							</div>
							<div class="comment_line">
								<p
									style="float: left; font-size: 11px; font-style: oblique; font-weight: bolder;">Date
									time post:</p>
								<p style="font-size: 11px; font-style: italic;">"${child.date}"</p>
								<span> "${child.content}" </span>
							</div>
						</c:forEach>
					</div>

					<c:if test="${not empty user }">
						<div class="comment_form">
							<div class="comment_personal">
								<center>
									<img src="/social/static/Upload/${user.avatar}.png"
										style="height: 70px; width: 70px; float: left"
										alt="${user.name}" />
									<p style="float: left;">"${user.name}"</p>
								</center>
							</div>
							<form method="post">
								<div class="comment_form_input">
									<textarea rows="7" cols="50" name="content">
                        			</textarea>
								</div>

								<div class="btn_submit">
									<input type="submit" value="Send" name="btn_submit_comment"
										id="btn_submit_comment" />
								</div>
							</form>
						</div>
					</c:if>
				</c:if>
			</div>

			<div id="footer">This is footer</div>

		</div>
	</div>
	<!--End #main_wrapper-->
</body>
</html>
